<template>
	<view class="bgw">
		<view class="blank20"></view>
		<view class="wrapper">
			<text style="font-weight: bold;">{{detail.title}}</text>
			<text class="ml15 text-gray font-22">{{detail.desc}}</text>
		</view>
		<view class="blank20"></view>
		<view class="flex" style="flex-wrap: wrap">
			<view class="menu-item" :class="v.auth?'':'unAuth'" v-for="v in detail.list" @click="bindTap(v)">
				<image class="menu-icon" :src="v.icon" mode="aspectFit"></image>
				<view class="blank20"></view>
				<view class="text-center">
					{{ v.title }}
				</view>
				<view class="blank20"></view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		props: {
			detail: Object
		},
		data() {
			return {

			};
		},
		created() {

		},
		methods:{
			bindTap(v){
				if(v.auth){
					if(v.tap){
						this.$emit("bindTap",v.tap);
						return;
					}
					if(v.url == '/pages/purchase/purchase'||v.url == '/pages/stock/stock'||v.url == '/pages/report/report'){
						this.nav(v.url,'switchTab');
						return;
					}
					this.nav(v.url);
				}else{
					uni.$u.toast("无权限");
				}
			}
		}
	};
</script>
<style lang="scss" scoped>
	.menu-icon {
		display: block;
		width: 130upx;
		height: 130upx;
		margin: 0 auto;
	}
	.menu-item{
		width: 25%;
	}
	.unAuth{
		opacity: 0.5;
	}
</style>